<template></template>
<script setup>
import { getCurrentInstance, onMounted } from 'vue'
import { Query } from '@/hook/mapgis-api/Query'
import { setLineStyle } from '@/hook/ol-api/index'
onMounted(() => {
  let $map = null
  const { proxy } = getCurrentInstance()
  $map = proxy.$map
  let service = {
    name: import.meta.env.VITE_DOC_NAME,
    /* 图层id */
    layerId: 1
  }
  Query.queryByLayerId({
    service,
    success: (feature) => {
      console.log(feature)
      feature.forEach((item) => {
        let num = item.values_.values_.车流量
        const arr = item.values_.geometry.flatCoordinates
        // 设置线数据
        const linegeometry = []
        for (let i = 0; i < arr.length; i += 2) {
          let arr1 = [arr[i], arr[i + 1]]
          linegeometry.push(arr1)
        }
        // 绘制线图层
        let line = new ol.Feature({
          geometry: new ol.geom.LineString(linegeometry)
        })
        if (num < 1000) {
          line.setStyle(setLineStyle({ color: 'green', width: 4 }))
        } else if (num >= 1000 && num < 1500) {
          line.setStyle(setLineStyle({ color: 'yellow', width: 4 }))
        } else {
          line.setStyle(setLineStyle({ color: 'red', width: 4 }))
        }
        var source = new ol.source.Vector({
          features: [line]
        })
        //创建一个图层
        var vector = new ol.layer.Vector({
          name:'流量图层',
          source: source
        })
        //将绘制层添加到地图容器中
        $map.addLayer(vector)
       
      })
    }
  })
})
</script>

<style></style>
